<!doctype html>
<html>
<head>
 <title>IE7 {CSS2: auto}</title>

 <!-- Compliance patch for Microsoft browsers -->
 <!--[if lt IE 9]><script src="../trunk/lib/IE9.js"></script><![endif]-->

 <style>

  div.container {background-color: silver;}

  div.container div {
   border: 20px solid black;
   background-color: gray;
   width: 20px;
   height: 20px;
  }

  div.container > div {
   background-color: yellow;
  }

  #container1 div {margin: auto 0;}

  #container2 div {margin: auto;}

  #container3 div {margin-left: auto;}

  #container4 div {margin: 0 auto;}

  #container5 div {margin-left: auto; margin-right: auto;}

 </style>
</head>

<body>
 <script src="ie7-demo.js"></script>
 <h2>margin: auto</h2>

 <p><div class="container" id="container1"><div></div></div></p>
 <p><div class="container" id="container2"><div></div></div></p>
 <p><div class="container" id="container3"><div></div></div></p>
 <p><div class="container" id="container4"><div></div></div></p>
 <p><div class="container" id="container5"><div></div></div></p>

 <p>&lt;&nbsp;<a href="index.html">back</a></p>
</body>
</html>
